// 封装一个弹框组件
import React from "react"
import PropTypes from "prop-types"

export const Dialog = (props) => {
    // 获取传递的属性和插槽信息
    let { title, content, children } = props
    children = React.Children.toArray(children)

    return (
        <div className="dialog-box">
            <div className="header">
                <h2 className="title">{title}</h2>
                <span>X</span>
            </div>
            <div className="main">{content}</div>
            {children.length > 0 ? <div className="footer">{children}</div> : null}
        </div>
    )
}

// 属性校验
Dialog.defaultProps = {
    title: "温馨提示",
}

Dialog.propTypes = {
    title: PropTypes.isRequired,
    content: PropTypes.string.isRequired,
}
